<template>
<view>
<view class="search-bar-area">
	<uni-search-bar bgColor="#f6f6f6" :radius="100" @confirm="search"  @clear="clear" @cancel="clear">
	</uni-search-bar>
</view>
<view class="org-list">
	<div class="org-item-box"  v-for="(item, idx) in orgList" :key="idx" @tap="toDetail" :data-org-id="item.id">
		<image class="org-cover" :src="item.imageUrl?item.imageUrl:'/static/images/defaultorg.png'"></image>
		<view class="org-content-area">
			<div class="main-info">
				<div class="title">{{item.name}}</div>
				<div class="address">地址： {{item.province?item.province:' '}}  {{item.city?item.city:' '}}  {{item.area?item.area:''}}</div>	
			</div>
			<div class="meta-info">
				<div class="number">{{item.countVolunteer?item.countVolunteer:0}}</div>
				<div class="unit">组织人数</div>
			</div>
		</view>
	</div>
</view>

<view class="no_data" v-if="orgList.length===0">暂无数据~</view>
<view class="no_more" v-if="orgList.length!==0&&noMore">没有更多数据了~</view>
</view>
</template>

<script>
var t = require("../../utils/request.js"),
    a = require("../../utils/util.js"),
    e = function (t) {
  return t && t.__esModule ? t : {
    default: t
  };
}(require("../../utils/api.js")),
    o = (getApp(), e.default.departmentList),
    i = e.default.dictionaryCounty;

export default {
  data() {
    return {
	queryOrgName: "",
      provinceId: "",
      cityId: "",
      page: 1,
      county: "全部",
      countyId: "",
      countyIdx: 0,
      category: "服务类型",
      categoryId: "",
      categoryIdx: 0,
      order: "智能筛选",
      orderIdx: 0,
      orderId: "",
      countyList: [{
        name: "全部",
        id: "",
        _id: "",
        code: ""
      }],
      categoryList: [{
        name: "服务类型",
        value: "",
        _id: ""
      }],
      orderList: [],
      noMore: !1,
      orgList: [],
      level: ""
    };
  },

  components: {},
  props: {},
  onLoad: function (t) {
    try {
      var a = uni.getStorageSync("areaId");
      console.log(a), this.setData({
        provinceId: a.p_id,
        cityId: a.c_id,
        countyId: a.d_id,
        level: a.level
      });
    } catch (t) {
      console.log(t);
    }

    this.getOrgList("init");
  },
  onReady: function () {},
  onShow: function () {},
  onHide: function () {},
  onUnload: function () {},
  onPullDownRefresh: function () {
    this.setData({
      page: 1,
      noMore: !1
    }), this.getOrgList("refresh");
  },
  onReachBottom: function () {
    if (!this.noMore) {
      var t = this.page;
      this.setData({
        page: ++t
      }), this.getOrgList("load");
    }
  },
  onShareAppMessage: function () {
    return {
      title: "让公益更生活 让生活更公益",
      path: "/pages/index/index",
      imageUrl: "/static/images/zyh_logo.jpg"
    };
  },
  methods: {
	  search(e) {
		this.queryOrgName = e.value
		this.getOrgList("normal")
	  },
	  clear() {
		  this.queryOrgName = ''
		  this.getOrgList("normal")
	  },
		queryOrgs: function(t) {
			this.queryOrgName = t.detail.value;
			this.getOrgList();
		},
    countyChange: function (t) {
      var a = t.detail.value,
          e = this.countyList;
      2 == this.level ? this.setData({
        county: e[a].name,
        countyId: e[a].id
      }) : 1 == this.level && this.setData({
        county: e[a].name,
        cityId: e[a].id
      }), uni.pageScrollTo({
        scrollTop: 0,
        success: function () {
          uni.startPullDownRefresh();
        }
      });
    },
    categoryChange: function (t) {
      var a = t.detail.value,
          e = this.categoryList;
      this.setData({
        category: e[a].name,
        categoryId: e[a]._id
      }), uni.pageScrollTo({
        scrollTop: 0,
        success: function () {
          uni.startPullDownRefresh();
        }
      });
    },
    orderChange: function (t) {
      var a = t.detail.value,
          e = this.orderList;
      this.setData({
        order: e[a].name,
        orderId: e[a].value
      }), uni.pageScrollTo({
        scrollTop: 0,
        success: function () {
          uni.startPullDownRefresh();
        }
      });
    },
    getOrgList: function () {
      var e = this,
          i = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : "load",
          n = {
        data: {
          api: o,
					name: this.queryOrgName,
          pageNo: this.page,
          pageSize: 10
        }
      };
      return (0, t.request)(n, "normal", !0).then(function (t) {
        if (t.data.success) {
          t.data.data.rows.length < 10 && e.setData({
            noMore: !0
          });
          var o = [];

          if (t.data.data.rows.forEach(function (t, a) {
            o.push(t);
          }), "load" === i) {
            var n = e.orgList;
            console.log("load"), e.setData({
              orgList: n.concat(o)
            });
          } else "init" === i ? (e.getCountyList(), e.setData({
            orgList: o,
            categoryList: e.categoryList.concat(t.data.category),
            orderList: [{
              name: "智能筛选",
              value: "",
              _id: ""
            }].concat(t.data.ordertype)
          })) : (e.setData({
            orgList: o
          }), uni.stopPullDownRefresh());
        }
      });
    },
    getCountyList: function () {
      var a = this,
          e = {
        data: {
          api: i,
          typecode: "areatree",
          parentid: this.countyId || this.cityId || this.provinceId
        }
      };
      return (0, t.request)(e, "common", !1).then(function (t) {
        if (t.data.length > 0 && !a.countyId) {
          var e = [{
            name: "全部",
            id: "",
            _id: "",
            code: ""
          }];
          a.setData({
            countyList: e.concat(t.data)
          });
        } else a.setData({
          countyList: []
        });
      });
    },
    toDetail: function (t) {
      uni.navigateTo({
        url: "/pages/org/detail?id=" + t.currentTarget.dataset.orgId
      });
    }
  }
};
</script>
<style lang="scss">
page {
    width: 100%;
    height: auto;
    min-height: 100%;
    background: #f4f4f4;
    padding-bottom: 60rpx;
}

.search-bar-area {
	background:  #fff;
}

.org-list {
	background-color: #ffffff;
	border-top: solid #f4f4f4 4rpx;
	.org-item-box {
		display: flex;
		flex-direction: row;
		align-items: center;
		.org-cover {
			width: 81rpx;
			height:  81rpx;
			margin: 0 34rpx;
		}
		.org-content-area {
			border-bottom: solid #e1e1e1 2rpx;
			flex: 1;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			.main-info {
				width: 390rpx;
				display: flex;
				flex-direction: column;
				padding: 38rpx 0;
				.title {
					font-size: 30rpx;
					color: #000000;
					font-weight: bold;
					margin-bottom: 15rpx;
					text-overflow: -o-ellipsis-lastline;
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					-webkit-box-orient: vertical;
				}
				.address {
					color: #a3a3a3;
					font-size: 25rpx;
					text-overflow: -o-ellipsis-lastline;
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					-webkit-box-orient: vertical;
				}
			}
			.meta-info {
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				margin-right: 30rpx;
				.number {
					color: #24cba9;
					font-weight: bold;
					margin-bottom: 16rpx;
					font-size: 30rpx;
					line-height: 30rpx;
				}
				.unit {
					color: #000000;
					font-weight: bold;
					font-size: 20rpx;
				}
			}
		}
	}
}

.select_wrapper {
    position: fixed;
    top: 0;
    /*  #ifdef  H5  */
    top:88rpx;
    /*  #endif  */
    left: 0;
    z-index: 99;
    width: 100%;
    height: 100rpx;
    justify-content: flex-start;
    background: #fff;
    border-top: 1rpx solid #e1e2e3;
    background: #f4f4f4;
    margin-bottom: 10rpx;
    padding-bottom: 10rpx;
}

.select_wrapper picker {
    flex: 0 0 33.33%;
    width: 33.33%;
    height: 90rpx;
}

.select_wrapper picker.double {
    flex: 0 0 50%;
    width: 50%;
    height: 90rpx;
}

.select_wrapper .select_sec {
    width: 100%;
    height: 90rpx;
    background: #fff;
}

.select_wrapper picker+picker>.select_sec {
    border-left: 1rpx solid #e1e2e3;
}

.select_sec .txt {
    flex: none;
    height: 100%;
    line-height: 90rpx;
}

.select_sec image {
    flex: 0 0 12rpx;
    width: 12rpx;
    height: 6rpx;
    margin-left: 12rpx;
}

.org_sec {
    width: 100%;
    height: 275rpx;
    margin-bottom: 10rpx;
    background: #fff;
}

.org_sec .org_desc {
    width: 100%;
    height: 140rpx;
    padding: 30rpx;
    justify-content: flex-start;
}

.org_desc image {
    flex: 0 0 80rpx;
    width: 80rpx;
    height: 80rpx;
    margin-right: 30rpx;
}

.org_desc .desc {
    flex: auto;
}

.org_desc .desc .name {
    max-width: 580rpx;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-bottom: 15rpx;
    font-weight: 500;
    font-size: 30rpx;
    color: #333;
}

.org_desc .desc image {
    width: 16rpx;
    height: 22rpx;
    padding: 0;
    margin: 0 8rpx 0 0;
}

.org_desc .desc text {
    font-size: 24rpx;
}

.org_sec .amount {
    justify-content: flex-start;
    border-top: 1rpx solid #e1e2e3;
}

.amount .amount_item {
    flex: auto;
    flex-direction: column;
    height: 135rpx;
    border-right: 1rpx solid #e1e2e3;
    align-content: center;
}

.amount .amount_item:last-child {
    border-right: none;
}

.amount .num {
    font-size: 36rpx;
    font-weight: 700;
}

.amount .num,.amount .txt {
    width: 100%;
    height: auto;
    text-align: center;
}

.amount .txt {
    font-size: 24rpx;
}
</style>